<template>
    <div class="box">
        <div class="title">
            <strong>{{ $t("index-notice.M001") }}</strong>
            <router-link to="/" class="aclink">{{ $t("index-notice.M002") }}+</router-link>
        </div>
        <div class="notice">
            {{ $t("index-notice.M003") }}
        </div>
    </div>
</template>
<style scoped>
.box {
    padding: 20px;
    background-color: $c_3;
    font-size: $fs_2;
    margin-top: 10px;
}

.notice {
    border-top: 1px $c_17 dotted;
    margin-top: 10px;
    padding: 15px 0;
    min-height: 140px;
}

.title {
    font-size: $fs_4;
    color: $c_4;
    position: relative;

    .aclink {
        position: absolute;
        right: 22px;
        top: 0px;
        font-size: $fs_1;
        font-weight: normal;
        color: $c_2;

        &:hover {
            font-weight: bold;
        }
    }
}

</style>